<template>
  <div class="dialog">
    <el-dialog v-if="showDialog" title="设备详情" :visible.sync="showDialog" width="55%" top="0" :close-on-click-modal="false" @close="cancel">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="基础信息" name="first" />
        <el-tab-pane label="购置信息" name="second" />
        <el-tab-pane label="其他信息" name="fourth" />
      </el-tabs>
      <el-form v-if="activeName === 'first'" ref="ruleForm" label-position="left" :model="formData" :rules="rules" class="el-form">
        <el-form-item label="设备名称：" prop="equipmentName" class="w50p">
          <el-input v-model="formData.equipmentName" placeholder="请输入设备名称" :disabled="!editStatus" />
        </el-form-item>
        <el-form-item label="所属设备型号：" prop="equModelCode" class="w50p">
          <el-select v-model="formData.equModelCode" filterable clearable :disabled="!editStatus">
            <el-option v-for="(item, index) in equModelArr" :key="index + 'equModelCode'" :label="item.modelName" :value="item.equModelCode" />
          </el-select>
        </el-form-item>
        <el-form-item label="生产日期：" prop="produceDate" class="w50p">
          <el-date-picker v-model="formData.produceDate" type="date" value-format="yyyy-MM-dd" placeholder="选择日期" />
        </el-form-item>
        <el-form-item label="生产企业：" prop="manufacturer" class="w50p">
          <el-input v-model="formData.manufacturer" placeholder="请输入生产企业" />
        </el-form-item>
        <el-form-item label="出厂序号：" prop="serialNumber" class="w50p">
          <el-input v-model="formData.serialNumber" placeholder="请输入出厂序号" />
        </el-form-item>
        <el-form-item label="品牌：" prop="brand" class="w50p">
          <el-input v-model="formData.brand" placeholder="请输入品牌" />
        </el-form-item>
        <el-form-item v-if="!editStatus" label="设备图片：" prop="picture" class="w100p" />
        <el-form-item v-else label="设备图片：" prop="picture" class="w100p">
          <UploadFile :module-type="moduleType" :auto-delete="false" :file-list.sync="uploadPictureList" multiple @addFile="(res, uploadFile) => handlerAddFileList(res, uploadFile, 'png')" @removeFile="handlerDeleteId($event, 'png')" />
        </el-form-item>
        <el-form-item v-if="!editStatus" label="设备视频：" prop="video" class="w100p">
          <div style="width:100%">
            <video :src="videoUrl" class="video-con" controls></video>
          </div>
        </el-form-item>
        <el-form-item v-else label="设备视频：" prop="video" class="w100p">
          <UploadFile :module-type="moduleType" :auto-delete="false" :file-list.sync="videoUrlList" multiple accept=".mp4" @addFile="(res, uploadFile) => handlerAddFileList(res, uploadFile, 'video')" @removeFile="handlerDeleteId($event, 'video')" />
        </el-form-item>
      </el-form>
      <el-form v-if="activeName === 'second'" ref="ruleForm" label-position="left" :model="formData1" :rules="rules" class="el-form">
        <el-form-item label="设备名称：" prop="equipmentCode" class="w50p">
          <el-input v-model="formData1.equipmentName" placeholder="请输入设备名称" :disabled="true" />
        </el-form-item>
        <el-form-item label="购置日期：" prop="purchaseDate" class="w50p">
          <el-date-picker v-model="formData1.purchaseDate" type="date" value-format="yyyy-MM-dd" placeholder="请选择购置日期" />
        </el-form-item>
        <el-form-item label="质保期：" prop="sellByDate" class="w50p">
          <el-input v-model.number="formData1.sellByDate" placeholder="请输入质保期">
            <template slot="append">月</template>
          </el-input>
        </el-form-item>
        <el-form-item label="质保日期：" prop="warrantyDate" class="w50p">
          <el-date-picker v-model="formData1.warrantyDate" type="date" value-format="yyyy-MM-dd" disabled placeholder="请选择生产日期和输入质保期" />
        </el-form-item>
        <el-form-item label="供应商：" prop="taxpayerNumber" class="w50p">
          <el-input v-model="formData1.taxpayerNumber" placeholder="请输入供应商" />
        </el-form-item>
        <el-form-item label="补贴金额：" prop="purchaseSubsidy" class="w50p">
          <el-input v-model="formData1.purchaseSubsidy" placeholder="请输入补贴金额" />
        </el-form-item>
        <el-form-item label="购置金额：" prop="purchaseAmount" class="w50p">
          <el-input v-model="formData1.purchaseAmount" placeholder="请输入购置金额" />
        </el-form-item>
        <el-form-item label="购置备注：" prop="purchaseRemark" class="w50p">
          <el-input v-model="formData1.purchaseRemark" placeholder="请输入购置备注" />
        </el-form-item>
      </el-form>
      <el-form v-if="activeName === 'fourth'" label-position="left" :model="formData2" :rules="rules" class="el-form">
        <el-form-item label="设备说明书：" class="w100p">
          <UploadFile :file-list.sync="docuemntList" :auto-delete="false" :module-type="moduleType" accept=".doc, .docx, .pdf, .xls, .xlsx" @addFile="(res, uploadFile) => handlerAddFileList(res, uploadFile, 'docuemnt')" @removeFile="handlerDeleteId($event, 'docuemnt')">
            <el-button size="small" type="primary">点击上传</el-button>
          </UploadFile>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button class="cancelbtn" @click="cancel()">取 消</el-button>
        <el-button v-if="editStatus === false" type="primary" class="editbtn" @click="editStatus = true">
          <i class="el-icon-edit-outline"></i>
          <span>修改完善信息</span>
        </el-button>
        <el-button v-if="editStatus === true" type="primary" class="savebtn" @click="save()">保 存</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import equipStandingBookApi from '@/api/processing-management/equip-manage/equip-standing-book';
import equipScrapRecordApi from '@/api/processing-management/equip-manage/equip-scrap-record';
import equipPurchaseRecordApi from '@/api/processing-management/equip-manage/equip-purchase-record';
import documentApi from '@/api/document';
import dataItemManageApi from '@/api/processing-management/basic-info-manage/data-item-manage';
import EquipmentApi from '@/api/processing-management/equip-manage/equipment/index';
import UploadFile from '@/components/UploadFile/index';
import CommonFileApi from '@/api/common-file';
export default {
  name: '',
  components: { UploadFile },
  props: {
    value: Boolean,
    nowChanceStau: {
      type: String,
      default: ''
    },
    editObject: {
      type: [Object],
      default: () => {
        return {};
      }
    },
    equModelArr: {
      type: [Array],
      default: () => {
        return [];
      }
    }
  },
  data() {
    return {
      moduleType: 'PROCESSTEST',
      upDownType: 'FTP',
      lnglat: [],
      // 图片文件
      modePicture: {},
      // 视频文件
      modeVideo: {},
      // 文档文件
      modeDocument: [],
      // 上传视频文件后返回的视频id
      equipmentVideoIdList: [],
      fileList: [],
      // 视频地址
      videoUrl: '',
      // 存放视频的数组
      videoUrlList: [],
      // 存放文档的数组
      docuemntList: [],
      // 选中的tab页
      activeName: 'first',
      // 是否处于编辑状态
      editStatus: true,
      // 图片预览状态
      dialogVisible: false,
      // 存放图片列表的数组
      uploadPictureList: [],
      // 图片预览url
      dialogImageUrl: '',
      pictureData: '',
      pictureList: [],
      formData: {},
      rules: {
        equModelCode: [
          {
            required: true,
            message: '请选择设备型号',
            trigger: ['change', 'blur']
          }
        ],
        equipmentName: [
          {
            required: true,
            message: '请输入设备名称',
            trigger: ['change', 'blur']
          }
        ],
        operationMode: [
          {
            required: true,
            message: '请选择是否展示工况数据',
            trigger: ['change', 'blur']
          }
        ],
        produceDate: [
          {
            required: true,
            message: '请选择生产日期',
            trigger: ['blur', 'change']
          }
        ],
        sellByDate: [
          {
            required: true,
            message: '请输入质保期',
            trigger: ['blur', 'change']
          }
        ],
        selfDriving: [
          {
            required: true,
            message: '请选择是否可自动驾驶',
            trigger: ['change', 'blur']
          }
        ],
        equipmentCode: [
          {
            required: true,
            message: '请选择设备名称',
            trigger: ['change', 'blur']
          }
        ],
        num: [
          {
            required: true,
            message: '请输入购置数量',
            trigger: ['change', 'blur']
          }
        ],
        total: [
          {
            required: true,
            message: '请输入购置总金额',
            trigger: ['change', 'blur']
          }
        ],
        purchaseDate: [
          {
            required: true,
            message: '请选择购置日期',
            trigger: ['change', 'blur']
          }
        ],
        scrapSubsidy: [
          {
            required: true,
            pattern: /^-?\d{1,16}(?:\.\d{1,8})?$/,
            message: '请输入报废补贴金额(数字)',
            trigger: ['change', 'blur']
          }
        ],
        scrapDate: [
          {
            required: true,
            message: '请选择报废日期',
            trigger: ['change', 'change']
          }
        ]
      },
      yesOrNoList: [
        { name: '是', id: 0 },
        { name: '否', id: 1 }
      ],
      // 添加修改
      parameterList: [],
      formData1: {},

      // 单位
      unitArr: [],
      formData2: {},

      equipmentArr: [],
      showDialog: this.show,
      // 报废信息
      scrapObject: {},
      // 购置信息
      startDatePicker: this.beginDate(),
      purchaseObject: {},
      scrapNowChanceStau: 'add',
      purchaseNowChanceStau: 'add',
      acept: '',
      acct: '',
      statusArr: [
        {
          name: '启用',
          id: 'ENABLE'
        },
        {
          name: '废弃',
          id: 'DISCARD'
        },
        {
          name: '维修中',
          id: 'REPAIRING'
        },
        {
          name: '禁用',
          id: 'DISABLE'
        }
      ]
    };
  },
  watch: {
    value(v) {
      this.showDialog = v;
    },
    editObject(v) {
      if (v && v.equipmentCode) {
        this.formData1 = {
          equipmentCode: this.editObject.equipmentCode,
          equipmentName: this.editObject.equipmentName,
          ...this.editObject
        };
        this.formData2 = {
          equipmentCode: this.editObject.equipmentCode,
          equipmentName: this.editObject.equipmentName,
          ...this.editObject
        };
        this.formData = this.editObject;
        if (v.longitude && v.latitude) {
          this.lnglat = [v.longitude, v.latitude];
        }
        (this.formData.operationMode = this.editObject.operationMode === false ? 1 : 0), (this.formData.selfDriving = this.editObject.selfDriving === false ? 1 : 0);
        this.scrapNowChanceStau = 'edit';
        this.purchaseNowChanceStau = 'edit';
        this.scrapObject = {};
        this.purchaseObject = {};
        this.queryDocument(v.equipmentCode);
      }
    },
    'formData1.purchaseDate': {
      deep: true,
      handler(v) {
        if (v && this.formData1.sellByDate) {
          var dt = new Date(v);
          dt.setMonth(dt.getMonth() + this.formData1.sellByDate);
          //  document.write( dt );
          this.$set(this.formData1, 'warrantyDate', this.dateToFormatTwo(dt));
        } else {
          this.$set(this.formData1, 'warrantyDate', '');
        }
      }
    },
    'formData1.sellByDate': {
      deep: true,
      handler(v) {
        if (v && this.formData1.purchaseDate) {
          var dt = new Date(this.formData1.purchaseDate);
          dt.setMonth(dt.getMonth() + v);
          //  document.write( dt );
          this.$set(this.formData1, 'warrantyDate', this.dateToFormatTwo(dt));
        } else {
          this.$set(this.formData1, 'warrantyDate', '');
        }
      }
    },
    'formData2.scrapDate': {
      deep: true,
      handler(v) {
        if (this.activeName === 'third') {
          if (v && this.formData2.purchaseDate) {
            this.$set(this.formData2, 'used', this.getDaysBetween(this.formData2.purchaseDate, v));
          } else {
            this.$message.warning('请先选择购置日期');
          }
        }
      }
    }
  },
  mounted() {
    this.queryUnitList();
    this.queryEquipment();
  },
  methods: {
    /**
     * @description 两个时间相减获取天数
     * @param {string} path
     * @returns {Boolean}
     */
    getDaysBetween(startDate, enDate) {
      const sDate = Date.parse(startDate);
      const eDate = Date.parse(enDate);
      if (sDate > eDate) {
        return 0;
      }
      if (sDate === eDate) {
        return 1;
      }
      const days = (eDate - sDate) / (1 * 24 * 60 * 60 * 1000);
      return days;
    },
    handleClick(tab, event) {
      this.$nextTick(() => {
        this.$refs.ruleForm?.clearValidate();
        this.$refs.ruleForm1?.clearValidate();
        this.$refs.ruleForm2?.clearValidate();
      });
    },

    // 时间限制
    beginDate() {
      const self = this;
      return {
        disabledDate(time) {
          if (self.formData.purchaseDate) {
            return time.getTime() <= new Date(self.formData.purchaseDate).getTime() - 1 * 24 * 60 * 60 * 1000;
          }
        }
      };
    },
    // //保存上传文件
    // modeUpload(item) {
    //   if (item.file.type === "video/mp4") {
    //     this.modeVideo = item.file;
    //     //调用上传视频的方法
    //     this.handleSuccessV();
    //   } else if (
    //     item.file.type === "image/jpg" ||
    //     item.file.type === "image/png" ||
    //     item.file.type === "image/jpeg"
    //   ) {
    //     this.modePicture = item.file;
    //     this.uploadPictureList.push(item.file);
    //     //调用上传图片的方法
    //     this.handleSuccess();
    //   } else {
    //     this.modeDocument = item.file;
    //     this.docuemntList.push(item.file);
    //     //调用上传文档的方法
    //     this.handleSuccessD();
    //   }
    // },
    // // // 图片上传
    // // handleSuccess() {
    // //   let that = this;
    // //   let fd = new FormData();
    // //   fd.append("file", this.modePicture);
    // //   fd.append("equipmentCode", this.editObject.equipmentCode);
    // //   documentApi.addPictureList(fd).then((res) => {
    // //     if (res.code === 1) that.$message.success("上传成功！");
    // //     else that.$message.error(res.msg);
    // //   });
    // // },

    // // 图片文件上传
    // imgRequest(files) {
    //   this.uploadRequest(files, "image")
    // },
    // // 视频
    // videoRequest(files) {
    //   this.uploadRequest(files, "video")
    // },
    // // 上传文件
    // uploadRequest(files, type) {
    //   let { file } = files
    //   let dataForm = new FormData()
    //   dataForm.append('file', file)
    //   dataForm.append('moduleType', 'SCIENCE_ARTICLE')
    //   this.uploading = true
    //   DocumentApi.getUploadUrl(dataForm).then(res => {
    //     this.uploading = false
    //     let filePath = res.data;
    //   }).catch(() => {
    //     this.$message.error('上传失败！')
    //     this.uploading = false
    //   })
    // },
    // // 文档上传
    // handleSuccessD() {
    //   let that = this;
    //   let fd = new FormData();
    //   fd.append("file", this.modeDocument);
    //   fd.append("fileName", this.modeDocument.name);
    //   fd.append("equipmentCode", this.editObject.equipmentCode);
    //   documentApi.addDocument(fd).then((res) => {
    //     if (res.code === 1) that.$message.success("上传成功！");
    //     else that.$message.error(res.msg);
    //   });
    // },
    // // 视频上传
    // handleSuccessV() {
    //   let that = this;
    //   let fd = new FormData();
    //   fd.append("file", this.modeVideo);
    //   fd.append("videoName", this.modeVideo.name);
    //   documentApi.addEquipmentVideo(fd).then((res) => {
    //     if (res.code === 1) {
    //       that.equipmentVideoIdList.push(res.data.equipmentVideoId);
    //       that.$message.success("上传成功！");
    //     } else that.$message.error(res.msg);
    //   });
    // },
    // // 图片删除
    // handleRemove(file) {
    //   let that = this;
    //   documentApi.delPictureList(file.equipmentPictureId).then((res) => {
    //     if (res.code === 1) that.$message.success("删除成功！");
    //     else that.$message.error(res.msg);
    //   });
    // },
    // // 视频删除
    // handleRemoveV(file) {
    //   let that = this;
    //   documentApi.delVideoList(file.equipmentVideoId).then((res) => {
    //     if (res.code === 1) {
    //       that.videoUrl = "";
    //       that.$message.success("删除成功！");
    //     } else that.$message.error(res.msg);
    //   });
    // },
    // // 文档删除
    // handleRemoveD(file) {
    //   let that = this;
    //   documentApi.delDocument(file.equipmentFileId).then((res) => {
    //     if (res.code === 1) {
    //       that.$message.success("删除成功！");
    //     } else that.$message.error(res.msg);
    //   });
    // },
    async queryDocument(params) {
      const { upDownType, moduleType } = this;
      // 查询当前设备图片
      this.uploadPictureList = [];
      EquipmentApi.getPictureByEquipmentCode(params).then(res => {
        if (res.code === 1) {
          const list = res.data;
          this.uploadPictureList = list.map(i => {
            return {
              equFileId: i.equipmentFileId,
              fileId: i.fileId,
              name: i.equipmentFileName,
              url: CommonFileApi.getFileUrl({
                upDownType,
                moduleType,
                fileId: i.fileId
              })
            };
          });
        }
      });
      // 查询当前设备视频
      this.videoUrlList = [];
      EquipmentApi.getVideoByEquipmentCode(params).then(res => {
        if (res.code === 1) {
          const list = res.data;
          this.videoUrlList = list.map(i => {
            return {
              equFileId: i.equipmentFileId,
              fileId: i.fileId,
              name: i.equipmentFileName,
              url: CommonFileApi.getFileUrl({
                upDownType,
                moduleType,
                fileId: i.fileId
              })
            };
          });
        }
      });

      // 查询当前设备文件
      this.docuemntList = [];
      EquipmentApi.getFileByEquipmentCode(params).then(res => {
        if (res.code === 1) {
          const list = res.data;
          this.docuemntList = list.map(i => {
            return {
              equFileId: i.equipmentFileId,
              fileId: i.fileId,
              name: i.equipmentFileName,
              url: CommonFileApi.getFileUrl({
                upDownType,
                moduleType,
                fileId: i.fileId
              })
            };
          });
        }
      });
    },
    // 文档下载
    downPDF(file) {
      documentApi.downPDF({ equipmentFileId: file.equipmentFileId }).then((res = {}) => {
        if (window.navigator.msSaveBlob) {
          // IE
          // IE无法打开Blob URL链接，所以不能预览只能通过window.navigator.msSaveBlob下载
          // 注：msSaveBlob的第二个参数要有.pdf后缀，不然IE下载后是没有后缀的文件
          const blob = new window.Blob([res.data], {
            type: 'application/pdf;charset-UTF-8'
          });
          window.navigator.msSaveBlob(blob, `${filename}.pdf`);
        } else {
          const blob = new window.Blob([res], {
            type: 'application/pdf;charset-UTF-8'
          });
          const href = URL.createObjectURL(blob);
          window.open(href);
        }
      });
    },
    queryScrap(params) {
      equipScrapRecordApi.query(params).then(res => {
        if (res.code === 1) {
          let data = res.data || {};
          this.scrapObject = data;
          if (this.scrapObject.equipmentCode) {
            this.scrapNowChanceStau = 'edit';
            this.formData2 = this.scrapObject;
          } else {
            this.scrapNowChanceStau = 'add';
          }
        }
      });
    },
    queryPurchase(params) {
      equipPurchaseRecordApi.query(params).then(res => {
        if (res.code === 1) {
          let data = res.data || {};
          this.purchaseObject = data;
          if (this.purchaseObject.equipmentCode) {
            this.purchaseNowChanceStau = 'edit';
            this.formData1 = this.purchaseObject;
          } else {
            this.purchaseNowChanceStau = 'add';
          }
        }
      });
    },
    // 单位
    queryUnitList() {
      this.unitArr = [];
      dataItemManageApi.queryUnit({}).then(res => {
        if (res.code === 1) {
          let data = res.data || {};
          this.unitArr = data;
        } else {
          this.$message.error('单位名称给获取失败');
        }
      });
    },
    queryEquipment() {
      this.equipmentArr = [];
      equipScrapRecordApi.queryEquipment({}).then(res => {
        if (res.code === 1) {
          let data = res.data || [];
          for (var i in data) {
            this.equipmentArr.push({
              equipmentName: data[i],
              equipmentCode: i
            });
          }
        }
      });
    },
    save() {
      if (this.activeName === 'first') {
        this.saveInfo('ruleForm');
      } else if (this.activeName === 'second') {
        this.savePurchase('ruleForm');
      } else {
        this.$message.success('修改成功！');
        this.$emit('reflash');
        this.close();
      }
      this.editStatus = true;
    },
    saveInfo(formData) {
      this.$refs[formData].validate(async valid => {
        if (valid) {
          const tempData = { ...this.formData };
          delete tempData.status;
          EquipmentApi.editEquipment(tempData).then(res => {
            if (res.code === 1) {
              this.$message.success('保存成功！');
              this.$emit('reflash');
              this.close();
            }
          });
        } else {
          return false;
        }
      });
    },
    savePurchase(formData) {
      this.$refs[formData].validate(async valid => {
        if (valid) {
          const tempData = { ...this.formData1 };
          delete tempData.status;
          EquipmentApi.editEquipment(tempData).then(res => {
            if (res.code === 1) {
              this.$message.success('保存成功！');
              this.$emit('reflash');
              this.close();
            }
          });
        } else {
          return false;
        }
      });
    },
    // savePurchase(formData) {
    //   this.$refs[formData].validate(valid => {
    //     if (valid) {
    //       // 编辑接口
    //       var index = this.statusArr.findIndex(a => a.name === this.formData1.status);
    //       if (index !== -1) {
    //         this.formData1.status = this.statusArr[index].id;
    //       }
    //       if (this.purchaseNowChanceStau === 'edit') {
    //         // delete this.formData1.status

    //         equipStandingBookApi.edit(this.formData1).then(res => {
    //           if (res.code === 1) {
    //             this.$message.success('修改成功！');
    //             this.close();
    //           } else {
    //             // this.$message.error(res.msg);
    //             this.$message.error(res.msg && res.msg.includes('质保日期不能为空') ? '质保日期不能为空' : res.msg);
    //           }
    //         });
    //       } else if (this.purchaseNowChanceStau === 'add') {
    //         this.formData1.organizationMark = sessionStorage.organizationNo;
    //         equipStandingBookApi.add(this.formData1).then(res => {
    //           if (res.code === 1) {
    //             this.$message.success(res.msg);
    //             this.close();
    //           } else {
    //             this.$message.error(res.msg);
    //           }
    //         });
    //       }
    //     } else {
    //       return false;
    //     }
    //   });
    // },
    // 报废
    saveScrap(formData) {
      this.$refs[formData].validate(valid => {
        if (valid) {
          var index = this.statusArr.findIndex(a => a.name === '废弃');
          if (index !== -1) {
            this.formData2.status = this.statusArr[index].id;
          }

          this.formData2.scrapSubsidy = Number(this.formData2.scrapSubsidy);
          if (this.scrapNowChanceStau === 'edit') {
            equipStandingBookApi.edit(this.formData2).then(res => {
              if (res.code === 1) {
                this.$message.success('修改成功！');
                this.close();
              } else {
                this.$message.error(res.msg);
              }
            });
          } else if (this.scrapNowChanceStau === 'add') {
            equipStandingBookApi.add(this.formData2).then(res => {
              if (res.code === 1) {
                this.$message.success(res.msg);
                this.close();
              } else {
                this.$message.error(res.msg);
              }
            });
          }
        } else {
          return false;
        }
      });
    },
    // 添加-轮播图/视频
    handlerAddFileList(res, file, type) {
      if (type === 'png') {
        // this.uploadPictureList = data.list;
        this.handleSuccess(res.data, file);
      }
      if (type === 'video') {
        // this.videoUrlList = data.list;
        this.handleSuccessV(res.data, file);
      }
      if (type === 'docuemnt') {
        // this.docuemntList = data.list;
        this.handleSuccessD(res.data, file);
      }
    },
    // 文件上传
    handleSuccessD(res, file) {
      let that = this;
      EquipmentApi.addEquipmentFile({
        equipmentId: this.editObject.equipmentId,
        fileId: res.fileId,
        equipmentFileName: res.fileName,
        status: 'FILE'
      }).then(res => {
        if (res.code === 1) {
          const findIndex = this.docuemntList.findIndex(i => i.uid === file.uid);
          if (findIndex !== -1) {
            this.docuemntList[findIndex].equFileId = res.data.equipmentFileId;
          }
          that.$message.success('上传成功！');
        } else that.$message.error(res.msg);
      });
    },
    // 视频上传
    handleSuccessV(res, file) {
      let that = this;
      EquipmentApi.addEquipmentFile({
        equipmentId: this.editObject.equipmentId,
        fileId: res.fileId,
        equipmentFileName: res.fileName,
        status: 'VIDEO'
      }).then(res => {
        if (res.code === 1) {
          const findIndex = this.videoUrlList.findIndex(i => i.uid === file.uid);
          if (findIndex !== -1) {
            this.videoUrlList[findIndex].equFileId = res.data.equipmentFileId;
          }
          that.$message.success('上传成功！');
        } else that.$message.error(res.msg);
      });
    },
    // 图片上传
    handleSuccess(res, file) {
      EquipmentApi.addEquipmentFile({
        equipmentId: this.editObject.equipmentId,
        fileId: res.fileId,
        equipmentFileName: res.fileName,
        status: 'PICTURE'
      }).then(res => {
        if (res.code === 1) {
          const findIndex = this.uploadPictureList.findIndex(i => i.uid === file.uid);
          if (findIndex !== -1) {
            this.uploadPictureList[findIndex].equFileId = res.data.equipmentFileId;
          }
        }
      });
    },
    // 删除-轮播图/视频
    handlerDeleteId(file, type) {
      if (type === 'video') {
        EquipmentApi.delEquipmentFile(file.equFileId).then(res => {
          if (res.code === 1) {
            this.$message.success('删除成功！');
            this.videoUrlList.splice(
              this.videoUrlList.findIndex(i => i.uid === file.uid),
              1
            );
          } else this.$message.error(res.msg);
        });
      } else if (type === 'png') {
        EquipmentApi.delEquipmentFile(file.equFileId).then(res => {
          if (res.code === 1) {
            this.$message.success('删除成功！');
            this.uploadPictureList.splice(
              this.uploadPictureList.findIndex(i => i.uid === file.uid),
              1
            );
          } else this.$message.error(res.msg);
        });
      } else {
        EquipmentApi.delEquipmentFile(file.equFileId).then(res => {
          if (res.code === 1) {
            this.$message.success('删除成功！');
            this.docuemntList.splice(
              this.docuemntList.findIndex(i => i.uid === file.uid),
              1
            );
          } else this.$message.error(res.msg);
        });
      }
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    close() {
      this.clearValidate();
      this.$emit('input', false);
    },
    cancel() {
      this.clearValidate();
      this.$emit('input', false);
      this.editStatus = true;
    },
    clearValidate() {
      this.activeName = 'first';
      this.$refs.ruleForm?.clearValidate();
      this.$refs.ruleForm1?.clearValidate();
      this.$refs.ruleForm2?.clearValidate();
    }
  }
};
</script>

<style lang="scss" scoped>
::v-deep {
  .el-dialog__body {
    min-height: 66vh;
    max-height: 66vh;
    padding: 30px 20px 15px;
    // overflow-y:  auto;
  }
  .el-form {
    height: 56vh;
    overflow-y: auto;
    align-content: flex-start;
  }
}
.add-many {
  border: 1px solid #6ecae3;
  width: 40px;
  height: 40px;
  padding: 0;
  background-color: transparent;
  line-height: 40px;
  border-radius: 4px;
  color: rgb(161, 154, 154);
  font-weight: 600;
  i {
    font-size: 40px;
  }
}
.pointer {
  cursor: pointer;
}
::v-deep .el-upload-dragger {
  width: 330px;
}
.video-con {
  width: 100%;
  height: 200px;
}
::v-deep .el-dialog__wrapper .el-dialog .el-dialog__body .el-form .el-form-item .el-form-item__label {
  min-width: 160px !important;
}
::v-deep .el-tabs__item.is-active {
  color: #006e91;
}
::v-deep .el-image-viewer__close {
  color: #006e91;
}
::v-deep .el-tabs__item {
  font-size: 16px;
  &:hover {
    color: #006e91;
  }
}
::v-deep .el-tabs__active-bar {
  background-color: #006e91;
}
</style>
